import React from 'react';
import ReactEcharts from 'echarts-for-react';

var createReactClass = require('create-react-class');
const OnlineCharts = createReactClass({
  propTypes: {},
  getOtion: function() {
    const option = {
      tooltip: {
        formatter: '{a} <br/>{b} : {c}%',
      },
      series: [
        {
          name: '在线情况',
          type: 'gauge',
          data: [{ value: 100, name: '在线率' }],
          textStyle: {
            fontSize: 12,
          },
          detail: {
            formatter: '{value}%',
            fontSize: 12,
          },
        },
      ],
    };

    return option;
  },
  render: function() {
    return (
      <ReactEcharts
        option={this.getOtion()}
        theme="dark"
        style={{ height: '99%', width: '100%' }}
        className="react_for_echarts"
      />
    );
  },
});

export default OnlineCharts;
